<template>
  <div>
     <main-table
       :columns="tableColumns"
       :data="tableList"
       :loading="loading"
       :pagination="pagination"
       wrapperHeight="400px" height="100%"
     >
      <el-table-column slot="action" fixed="right" label="操作" width="100">
        <template slot-scope="scope">
          <el-button size="mini" type="primary" @click="confirmButton(scope.row)">确认</el-button>
        </template>
      </el-table-column>
     </main-table>
    <div class="contacts-add" style="padding-top: 20px;">
      <el-button @click="cancle">关闭</el-button>
    </div>
  </div>
</template>

<script>
import mainTable from "@/components/main-table/index";
import * as APIMedicalCare from '@/api/medicalCare';
export default {
  name: 'medicine-select',
  props: {
    data: {
      type: Object,
      default: () => {}
    }
  },
  components: {
    mainTable
  },
  data () {
    return {
      loading: false,
      tableList:[],
      pagination: {
        current: 1,
        size: 10,
        total: 0
      },
      tableColumns: [
       {
         index: true,
         fixed: true
       },
       {
         prop: 'title',
         label: '药品名称',
       },
       {
         prop: 'spec',
         label: '规格',
         width: 80
       },
       {
         prop: 'code',
         label: '批准文号'
       },
       {
         prop: 'quantity',
         label: '剩余库存',
         width: 100
       },
       {
         slot: 'action'
       }
      ],
    }
  },
  mounted () {
     // this.medicineGetarr()
  },
  methods: {
    getMedicineSearch(data){
      const self = this;
      const search = { ...data};
      APIMedicalCare.medicineSearch(search).then((resp) => {
         if (resp.code == 200) {
           // const { list = [], total = 0 } = resp.data;
           this.tableList = resp.data || []
           this.pagination.total = 0;
         }
      }).finally(() => {
        this.loading = false
      });
    },
    cancle () {
      this.$emit('cancle')
    },
    confirmButton(row){
      this.$emit('load',row)
      this.$emit('cancle')
    }
  },
  watch: {
    data: {
      handler (newval) {
         this.getMedicineSearch(newval);
      },
      // 可以一进页面就触发监听器  监听器自带的immediate
      immediate: true,
      deep: true
    }
  }
}
</script>

<style lang="scss">
.contacts-add {
  text-align: right;
}
</style>
